$(function(){
    var this_page=1;  //表示当前页
    $('#page').on('click','a',function(e){//点击那一页跳转那一页的内容
        e.preventDefault();//阻止a标签的跳转行为
        var val=$(this).attr('page');//取当前的页码
        this_page=val;//同步修改当前页码
        $.ajax({
            type:"get",
            url:"/ajax.php?ajax=table",
            data:{
                page:val
            },
            dataType:'json',
            success:function(mgs){
                var data=mgs.data;
                var count=mgs.count;
                var html='';
                for (var i in data) {
                    html+="<tr>";
                    for (var d in data[i]) {
                        if(d=='uid')
                        {
                            continue;
                        }
                        html+="<td>"+data[i][d]+"</td>"
                    }
                    html+='<td><button name="del" uid='+data[i]['uid']
                        +'>删除</button><button name="update" uid="'+data[i]['uid']
                        +'">修改</button></td></tr>';
                }
                $('#tab').html(html);
                var Ahtml='';
                for (var i=1;i<=count;i++) {
                    if(this_page==i)
                    {
                        Ahtml+="<a style='color:red' page='"+i+"'>"+i+"</a> "
                    }else{
                        Ahtml+="<a page='"+i+"'>"+i+"</a> ";
                    }

                }
                $('#page').html(Ahtml);
            }
        });
    });
    $('#page>a').trigger('click');//trigger(必需。规定指定元素上要触发的事件) 方法触发被选元素上指定的事件。
    $('#btn').click(function(){//提交
        var obj=$('#form').get(0);
        var f=new FormData(obj);//参数就是指定表单元素
        var name=$('input[name=name]').val();//姓名
        var classs=$('input[name=class]').val();//班级
        var age=$('input[name=age]').val();//年龄
        var mb=$('input[name=mb]').val();//学号
        var arr=[name,classs,age,mb];
        $.ajax({
            type:"post",
            url:"/ajax.php?ajax=insert",
            dataType:'json',
            processData:false,	//不对数据进行处理
            contentType:false,//不设置上传数据的类型
            data:f,
            success:function(mgs){
                if(mgs.statu==200)
                {
                    var html='<tr>';
                    for (var i=0;i<arr.length;i++) {

                        html+="<td>"+arr[i]+"</td>";
                    }
                    html+="<td><button name='del' uid='"+
                    mgs.info
                    +"'>删除</button><button name='update' uid='"+
                    mgs.info
                    +"'>修改</button></td></tr>";
                    $('#tab').prepend(html);
                    //console.log(mgs.info);返回最后一条插入语句产生的自增 ID
                    $('#tab tr').eq($('#tab tr').length-1).remove();
                }else if(mgs.statu==400)
                {
                    alert(mgs.info);
                }
            }
        });
    });
    $('#tab').on('click','button[name=del]',function(){//删除
        //alert();
        //console.log('这里是按钮的');
        //console.log($(this));
        var btn_this=$(this);
        $.ajax({
            type:"post",
            url:'/ajax.php?ajax=delete',
            data:{
                uid:$(this).attr('uid')
            },
            success:function(mgs){
                btn_this.parent().parent().remove(); //第一种方法

                //其他方法；

                //当我们添加一条记录，求不到当前这条记录的uid值
            }
        })

    });
    $('#tab').on('click','button[name=update]',function(){//修改
        //alert();
        //console.log('这里是按钮的');
        //console.log($(this));
        var btn_this=$(this);
        var conut=btn_this.parent().siblings();
        var len=btn_this.parent().siblings().length;
        for (var i=0;i<len;i++) {
            //console.log(conut.eq(i).text());eq() 方法返回带有被选元素的指定索引号的元素。
            $('.update>form>input').eq(i).val(conut.eq(i).text());//得到内容，添加到对应的文本框里
        }
        $('.update>form>input[name=uid]').val(btn_this.attr('uid'));
        $(".update").show();//show() 方法显示隐藏的被选元素。

    });
    $('#btn2').click(function () {
        var f=$('#form2').get(0);
        var form=new FormData(f);
        $.ajax({
           type:"post",
            url:"/ajax.php?ajax=update",
            data:form,
            processData:false,
            contentType:false,
            success:function (mgs) {
                if (mgs.status.code==200){
                    console.log('成功了要做什么');
                }else if (mgs.status.code==400) {
                    console.log('失败了要做什么');
                }
            }
        });
    });
});